.banner { position: relative; overflow: auto; height:530px; }
.banner ul li { float: left; -o-background-size: 100% 100%; -ms-background-size: 100% 100%; -moz-background-size: 100% 100%; -webkit-background-size: 100% 100%; background-size: 100% 100%; box-shadow: inset 0 -3px 6px rgba(0,0,0,.1); min-height:10em; }
.banner .btn { display: inline-block; margin: 25px 0 0; padding: 9px 22px 7px; clear: both; color: #fff; font-size: 12px; font-weight: bold; text-transform: uppercase; text-decoration: none; border: 2px solid rgba(255,255,255,.4);border-radius: 5px; }
.banner .btn:hover { background: rgba(255,255,255,.05);}
.banner .btn:active { -webkit-filter: drop-shadow(0 -1px 2px rgba(0,0,0,.5)); -moz-filter: drop-shadow(0 -1px 2px rgba(0,0,0,.5)); -ms-filter: drop-shadow(0 -1px 2px rgba(0,0,0,.5)); -o-filter: drop-shadow(0 -1px 2px rgba(0,0,0,.5)); filter: drop-shadow(0 -1px 2px rgba(0,0,0,.5)); }
.banner .btn, .banner .dot { -webkit-filter: drop-shadow(0 1px 2px rgba(0,0,0,.3)); -moz-filter: drop-shadow(0 1px 2px rgba(0,0,0,.3)); -ms-filter: drop-shadow(0 1px 2px rgba(0,0,0,.3)); -o-filter: drop-shadow(0 1px 2px rgba(0,0,0,.3));
filter: drop-shadow(0 1px 2px rgba(0,0,0,.3));}
.banner .dots {position: absolute;	left: 0; right: 0; bottom: 0; width: 100%; text-align:center; height:28px; padding:10px 0; }
.banner .dots .pp {bottom: 5px; list-style: outside none none; position: absolute; right: 3px;}
.banner .dots li { display: inline-block; *display: inline; zoom: 1; width:15px; height:15px; line-height:15px;margin: 0 6px; text-indent: -999em; *text-indent: 0; border: 1px solid #ebe8e5; border-radius:14px; cursor: pointer;opacity: .4; -webkit-transition: background .5s, opacity .5s; -moz-transition: background .5s, opacity .5s; transition: background .5s, opacity .5s;}
.banner .dots li.active { background: #ebe8e5; opacity: 1; }
@media screen and (max-width:750px){
.banner .dots li{width:12px; height:12px; line-height:12px; border-radius:10px;}
.banner .dots{height:14px;}
}